<template>
  <view class="Search xcc">
    <image class="logo" :src="logo" alt="" srcset="" />
    <view class="mac-ico-search txt-hid xcc" @click="click"><text class="fs08">{{ txt }}</text></view>
    <view class="mac-ico-cart txt-hid xcc" @click="cart"></view>
  </view>
</template>
<script lang="ts">
  import { defineComponent } from "vue";
  import { apiUrl, formatUrl } from "@/util";
  export default defineComponent({
    name: "Search",
    components: {},
    data() {
      return { txt: "", };
    },
    computed: {
      logo() {
        return formatUrl("/static/logo.png", apiUrl);
      }
    },
    created() { this.init(); },
    methods: {
      init() {
        this.txt = (uni.getStorageSync("search") || ["点击搜索"])[0];
      },
      click() {
        uni.navigateTo({ url: "/pages2/search" });
      },
      cart() {
        uni.switchTab({ url: "/pages/cart" });
      }
    },
  });
</script>
<style lang="scss" scoped>
  .Search {
    position: relative;
    width: 95%;
    margin: 0 auto;
    padding: 1em 0;
    display: flex;
    .logo {
      left: 0;
      top: 0;
      width: 4em;
      height: 4em;
      border-radius: 50%;
      margin-right: 1em;
      position: absolute;
    }
    .mac-ico-search {
      margin-left: 5em;
      color: #666;
      background-color: #eee;
      flex: 1;
      padding: 0.4em;
      border-radius: 0.4em;
      >.fs08 {
        font-size: .8em;
      }
    }
    >.mac-ico-cart {
      font-size: 1.4em;
      padding: 0 0 0 .6em;
    }
  }
</style>